<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>商品详情</title>
  <link type="text/css" rel="stylesheet" href="../css/MyCss.css" />
  <link rel="stylesheet" type="text/css" href="../css/ShopCartStyle.css" />
  <link type="text/css" rel="stylesheet" href="../css/right-bar.css" />
  <link type="text/css" rel="stylesheet" href="../css/base.css" />
  <style>
     *{margin:0;padding:0;font-size:12px}
	 a{text-decoration: none;}
	 .show{width:299px;height:308px;position:absolute;border: 1px solid #ece9e9;z-index:7;display:none;}
	 .infor-nav-con,.goods-nav-con,.flip-advert-con,.part1-con,.part2-con {width:1100px; margin:auto;}
	.goods-area-part1, .goods-area-part2, .part2-con, .goods-nav-con {overflow:hidden;}
	ul {list-style-type:none;}
	/* S - infor-nav */
	.infor-nav {width:100%; position:relative; background:#555;}
	.infor-nav .infor-nav-con {height:40px;}
	.infor-nav .infor-nav-con ul {}
	.infor-nav .infor-nav-con ul li {float:left; color:#fff; width:200px; margin:12px 0px;}
	.infor-nav .infor-nav-con ul li:nth-child(3) {width:300px;}  
	.infor-nav .infor-nav-con ul li .my-cart-i{background:url(../image/my-cart.png); }
	.infor-nav .infor-nav-con ul li:last-child {float:right;}
	.infor-nav .infor-nav-con label{cursor:pointer;}
	.infor-nav .infor-nav-con label:hover{color:#f6f4f0;}
	/* E - infor-nav */

	/* S - follow-box */
	.follow-box{width:100%; top:0; height:50px; background:#555; display:none; position:fixed;}
	/* E - follow-box */

	/* S - goods-nav */
	.shop-nav,.shop-icon {float:left;}
	.goods-nav{width:100%; }
	.goods-nav .goods-nav-con { height:20px; padding:30px 2px;}
	.goods-nav .goods-nav-con .shop-icon {}
	.goods-nav .goods-nav-con .shop-icon a{background:url(../image/store_ico.png);width: 48px;height: 48px;display: block;cursor:pointer; margin:-14px 10px;}
	.goods-nav .goods-nav-con .shop-nav {margin-left:80px;}
	.goods-nav .goods-nav-con .shop-nav ul li {float:left; width:60px; height:25px; text-align:center; line-height:25px; cursor:pointer;}
	.goods-nav .goods-nav-con .shop-nav ul li:hover{background:#555; color:#f6f4f0;}
	.goods-nav .goods-nav-con .shop-nav ul li:nth-child(1) {background:#555; color:#f6f4f0;}
	.goods-nav .goods-nav-con .shop-search {float:right;}
	.goods-nav .goods-nav-con .shop-search input {padding-left:30px;}
	.goods-nav .goods-nav-con .shop-search .shop-search-i {background:url(../image/shop_search.png); opacity:0.5; position:absolute; cursor:pointer;}
	.goods-nav .goods-nav-con .shop-search .shop-search-i:hover{opacity:1;}
	/* E - goods-nav */

 	 /*S-box_main*/
	 .box_main{margin-top:40px; margin-left:auto;margin-right:auto;width:1100px; height:500px; border-bottom:solid 1px rgba(104, 98, 93, 0.25);position:relative;}
	 /*main_left 主要区域的左边区域*/
	 .main_left{width:300px;height:77%;float:left;}
	 /*main_left_top 主要区域的左边区域的下边区域*/
	 .main_left .main_left_top{width:100%; height:80%;cursor:pointer;}
	 .main_left .main_left_top span{position:absolute;width:125px;height:125px;background:rgba(153, 209, 221, 0.33);border: 1px dashed #ccc;display:none;}
	 .main_left .main_left_bottom ul{list-style:none;margin-top:10px;}
	 .main_left .main_left_bottom ul li{float:left;margin-left:12px;cursor:pointer;}

     .main_con_info{float:left;margin-left:10px;height:400px;width:567px;padding:5px;}
	 .main_con_info .main_con_top{height:69px;border-bottom: 1px solid #f7ebeb;}
	 .main_con_info .main_con_top span:nth-child(1){font-size:24px;}
	 .main_con_info .main_con_top span:nth-child(3){font-size:14px;font-family: cursive;line-height:20px;}
	 .main_con_info .main_con_con{height:345px;padding:5px;}
	 .main_con_info .main_con_con
	 .price{height:83px;background: rgba(208, 134, 22, 0.09);padding-top:5px; padding-left:15px;line-height:34px;}
	 .main_con_con .price p span{font-size:24px;font-family: cursive;}
	 .main_con_con .price p span:nth-child(2){margin-left:26px;}
	 .main_con_con .size{margin-top:5px;border:1px solid #efecec;height:166px;}
     .main_con_con .size p{height: 12px; border-top: 3px solid #ccc; background: #ccc;padding: 8px; line-height: 10px;color: #fff;font-size:14px;}
	 .size > Label {display: block; overflow: hidden;}
	 .size > Label .span-support{height:16px; border:1px solid #ddd; padding:5px; display:block; float:left; margin:10px;}
	 /*
	 .size ul{list-style-type:none;height:46px;}
	 .size ul li{display:block;float:left;border:1px solid #ccc;width:60px; height:26px; text-align:center;line-height:26px;margin-left:38px;margin-top:8px;cursor:pointer;}
     .size ul li:hover{border:1px solid red;}
	 */
   
	 .main_con_button{height:80px;}
	 /*
	 .main_con_button input[type="button"]{width:130px;height:36px;border:1px solid #f90;border-radius:5px;background:#f90;font-size:14px;color:#fff;margin-top:20px;margin-left:92px;cursor:pointer;outline:none;}
	 .main_con_button input[type="button"]:hover{background:#f96924;}
	 
	 */
	 .input-button {margin-top: 20px; margin-left: 48px;}
	 
	 .main_right{float:left;width:201px;height:400px;margin-left:10px;}
	 .Picture_adver{height:200px;overflow:hidden;}
	 .Picture_adver div article{float:left;width:201px;height:100%;}
	 .Choice_{position:absolute;margin-top:-18px;margin-left:67px;}
	 .Choice_ label{list-style-type: none;float: left;display: block; width: 14px;height: 14px; border-radius: 11px; background: #ccc;text-align: center;line-height: 14px;margin-left: 2px; color: #fff;cursor:pointer;}
	 .Choice_ label:hover{background:#848484;}
	 /*E-box_main*/
	
	 /* S - foot */
	.foot{min-height:50px;}
	.bom_container{height:40px; width:900px; border-bottom:1px solid #ccc; margin:auto;}
	/* E - foot */

  </style>
 </head>
 <body>
  <span class="show" id="show">
       <img id="showimg" alt="图片" width="100%" height="100%"/>
  </span>
	<!--S - infor-nav-->
	<div class="infor-nav">
		<div class="infor-nav-con">
			<!--登录 注册 我的订单 我的个人信息 购物车 -->
			<ul>
				<li>
					<label class="loginText">您当前还未登录</label>&nbsp;&nbsp;&nbsp;&nbsp;
					<label class="register-bt">注册</label>
				</li>
				<li></li>
				<li></li>
				<li>
					<label class="my-infor">我的个人信息</label>&nbsp;&nbsp;
					<label class="my-order">我的订单</label>&nbsp;&nbsp;
					<label class="my-cart">
						<!--
						<i class="my-cart-i" title="购物车"></i>
						-->
						购物车
					</label>
				</li>
			</ul>
		</div>
	</div>
	<!--E - infor-nav-->

	<!--S - follow-box-->
	<div class="follow-box"></div>
	<!--E - follow-box-->

	<!--S - goods-nav-->
	<div class="goods-nav">
		<div class="goods-nav-con">
			<div class="shop-icon">
				<a href="../index.html"></a>
			</div>
			<div class="shop-nav">
				<ul>
					<li>服装</li>
					<li>日用品</li>
					<li>食品</li>
					<li>电子产品</li>
					<li>高科技</li>
				</ul>
			</div>
			<!--查找-->
			<div class="search" id="search">
				<input type="text" placeholder="请输入要商品关键字" id="search_text">
				<input type="button" value="搜索本站" id="search_button">
				<!--搜索结果显示区-->
				<div class="search_show" id="search_show"></div>
			</div>
		</div>
	</div>
	<!--E - goods-nav-->

  <!--S-box_main-->
  <div class="box_main" id="box_main">
      <!--main_left-->
      <div class="main_left" id="main_left">
		   <div class="main_left_top" id="main_left_top">
		       <span id="getshow"></span>
			   <img id="imgshow" width="100%" height="100%" src="../image/goods8.jpg" alt="">
			   
		   </div>
		   <div class="main_left_bottom" id="main_left_bottom">
			   <ul class="none">
				   <li>
				      <img id="imgshow1" alt=""  src="../image/goods5.jpg" width="60px" height="70px">
				   </li>
				   <li>
				      <img id="imgshow2" alt=""  src="../image/goods6.jpg" width="60px" height="70px">
				   </li>
				   <li>
				      <img id="imgshow3" alt=""  src="../image/goods8.jpg" width="60px" height="70px">
				   </li>
				   <li>
				      <img id="imgshow4" alt=""  src="../image/goods7.jpg" width="60px" height="70px">
				   </li>
			   </ul>
		   </div>
	  </div>
	  <!--main_con-->
      <div class="main_con_info">
		   <div class="main_con_top">
		        <span class="goodsName">商品名称</span><br>
				<span>八天无理由退换，质量品质有保障。本店只有一家，绝无第二家分店。你的信赖是对我们工作的最大支持。单件全国包邮。（港澳台地区除外）</span>
		   </div>
		   <div class="main_con_con">
		        <!--价格-->
		        <div class="price">
				     <p>
					      <span style="font-size: initial;">原价</span>
					      <span><del class="orig-price" style="font-size: initial;">888元</del></span>
					 </p>
					 <p>
					      <span style="float:left;">现价</span>
					      <span class="now-price" style="color:red;">666<i style="font-size:24px; display:-webkit-inline-box;">￥</i></span>
					 </p>
				</div>
				<!--尺码选择-->
				<div class="size" >
				     <p style="">选择尺码:</p>
					 <label class="sizes">
						
					 </label>
					 <p style="">选择颜色:</p>
					 <label class="colors">
						
					 </label>
					 <!--
					 <ul class="sizes">
					    <li>170/M</li>
						<li>175/L</li>
						<li>180/XL</li>
					 </ul>
					 <ul class="color">
					    <li style="width:26px;">颜色</li>
					 </ul>
					 <ul class="stylel">
					    <li style="width:26px;"></li>
						<li style="width:26px;"></li>
					 </ul>
					 -->
				</div>
				<div class="main_con_button">
					<input class="input-button add-Car-Bt" type="button" value="加入购物车">
					<input class="input-button add-Colle-Bt" type="button" value="收藏">
		        </div>
		   </div>
		   
	  </div>

	  <!--main_right-->
	  <div class="main_right" id="main_right">
	       <div class="Picture_adver" id="Picture_adver">
				<div id="article_con" style="width:804px;height:100%;">
				</div>
		        <div class="Choice_">
					  <label>1</label>
					  <label>2</label>
					  <label>3</label>
					  <label>4</label>
				</div>
		   </div>
		   <div></div>
	  </div>
	
  </div>
  <!--E-box_main-->
	
	<!--S -  foot-->
	<div class="foot">
		<div class="bom_container">
			<li style="color:#586069;list-style:none;padding:10px 245px;">Copyright ©2017 <span  style="color:#a71d5d;cursor:pointer;" title="作者介绍">chen</span> Powered By <span  style="color:#a71d5d;cursor:pointer;" title="程序目录">shop_net</span> Version 1.0.0</li>
		</div>
	</div>
	<!--E - foot-->
	
	<!-- start shop car -->
	<!-- 这里用到的模态框的技术 -->
	<div class="shopcar">
		<div class="shopcarcnt">
			<!-- shopcarclick 收进、出按钮 -->
			<div class="shopcarclick" id="shopcarclick">
				<ul class="nolist click-cnt">
					<!--<i class="shopclick_ico"></i><i class="p-infor"></i><i class="goods-colle"></i><i class="my-food"></i>-->
					<li class="clicknav my-infor-li" title="会员">
						<img src="../image/p_infor.png" width="25px" height="25px" alt=""/>
						<!--
						未登录
						<div class="bar-nologin">
							<div class="bar-in-com-nologin">
								<label>您未登录</label>
							</div>
						</div>
						<div class="bar-login">
							<div class="bar-in-com">
								<label>
									<div class="head-pi">
										<img src="image/test/tako.jpg" width="50px" height="50px" />
									</div>
									<div class="menber-name">
										<label>大购物狂</label>
										<label>
											<img title="蓝砖会员" src="image/person/Member3.png" width="20px" height="20px" />
										</label>
									</div>
									<div class="menber-integral">
										积分:25
									</div>
								</label>
							</div>
						</div>
						-->
						
					</li>
					<li class="clicknav car-bt-li" title="购物车">
						<img src="../image/car2.png" width="24px" height="24px" alt=""/>
						<!--

						未登录
						<div class="bar-nologin">
							<div class="bar-in-com-nologin">
								<label>未登录哦</label>
							</div>
						</div>
						-->
					</li>
					<li class="clicknav colle-bt-li" title="商品收藏">
						<img src="../image/colle1.png" width="25px" height="25px" alt=""/>
						<!--未登录
						<div class="bar-nologin">
							<div class="bar-in-com-nologin">
								<label>未登录哦</label>
							</div>
						</div>
						-->
						<!--
						收藏为空
						<div class="bar-login bar-login-null">
							<div class="bar-in-com-nologin">
								<label>空的哦</label>
							</div>
						</div>
						<div class="bar-login">
							<div class="bar-in-com">
							</div>
							<div class="bar-in-bom">
								<label>查看更多收藏</label>
							</div>
						</div>
						<div class="bar-login bar-login-null">
							<div class="bar-in-com-nologin">
								<label>空的哦</label>
							</div>
						</div>
						-->
						
					</li>
					<li class="clicknav foot-bt-li" title="个人足迹">
						<img src="../image/food.png" width="25px" height="25px" alt=""/>
						<!--
						未登录
						<div class="bar-nologin">
							<div class="bar-in-com-nologin">
								<label>未登录哦</label>
							</div>
						</div>
						<div class="bar-login">
							<div class="bar-in-com">
								<ul class="nolist">
									<li>
										<div class="lictn" data-id="">
											<label class="goodspho">
												<img src='image/test/tako.jpg' width="55" height="60" />
											</label>
											<label class="colledes">
												<label class="colle-infor">
													<label class="colle-name">黑白条纹打底衫</label>
													<label class="colle-price"><del>110</del>120</label>
												</label>
											</label>
										</div>
									</li>
								</ul>
							</div>
							<div class="bar-in-bom">
								<label>查看更多</label>
							</div>
						</div>
						-->
						
					</li>
				</ul>
			</div>
			

			<!-- list_cont -->
			<div class="list_cont">
				<!-- shopping_head 标题 -->
				<div class="shopping_head">购物车</div>

				<!-- shopping_list 购物清单 -->
				<div class="shopping_list">
					<div class="shop_list_cnt">
						<!-- 单个物品 -->	
						<ul class="nolist">
						</ul>
					</div>
				</div>
				<!-- shopping_result 结算结果 -->
				<div class="shopping_result">
					<div class="RMB_result">
						<span>合计</span>
						<span class="RMB_NUM">4000</span>
						<span>元</span>
					</div>
					<div class="result_button">
						<input type="button" value="结算" />
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- shop car end -->
 </body>
 <script src="../js/MyjsV0-8.js"></script>
 <script src="../js/shop_cart.js"></script>
 <script src="../js/util.js"></script>
 <script src="../js/data.js"></script>
 <script>
 
 //初始化页面
 var support1;
 var support2;
 var imgPath;
 var id;
 init();
 function init(){
	id = "0000";
	var item = getGoodsItemById(id);
	imgPath = "../" + item.get("img");
	$("#imgshow").src = "../" + item.get("img");
	$(".now-price")[0].text(item.get("price"));

	support1 = new Support($(".sizes")[0]);
	support1.add("S");
	support1.add("M");
	support1.add("L");
	support1.add("XL");
	support1.add("XXL");
	support1.commit();

	support2 = new Support($(".colors")[0]);
	support2.add("红色");
	support2.add("黑色");
	support2.add("紫色");
	support2.add("白色");
	support2.commit();
 }
 /*
 ajax({
	type:"post",
	url:"initGoodsPage",
	success:function(msg){
		if(isJSON(msg)){
			console.log(msg);
			var object = Tokener.parseObject(msg);
			id = object.get("id");
			imgPath = "../" + object.get("img");
			console.log(imgPath);
			$("#imgshow").src = imgPath; 
			$("#imgshow1").src = imgPath;
			$("#imgshow2").src = imgPath;
			$("#imgshow3").src = imgPath;
			$("#imgshow4").src = imgPath;
			$(".goodsName")[0].text(object.get("name"));
			$(".main_con_info")[0].attr("data-id", object.get("id"));
			$(".orig-price")[0].text(object.get("price"));
			if(object.get("discount").length > 0) $(".now-price")[0].text(object.get("discount")*object.get("price"));
			else $(".now-price")[0].text(object.get("price"));

			var sizeStr = object.get("sizes");
			support1 = new Support($(".sizes")[0]);
			if(sizeStr.indexOf("-") != -1){
				var sizearr = sizeStr.split("-");
				for(var i in sizearr) support1.add(sizearr[i]);
			}else support1.add(sizeStr);
			support1.commit();
			
			var colorStr = object.get("colors");
			support2 = new Support($(".colors")[0]);
			if(colorStr.indexOf("-") != -1){
				var colorarr = colorStr.split("-");
				for(var i in colorarr) support2.add(colorarr[i]);
			}else support2.add(colorStr);
			
			support2.commit();
		}
	},
	error:function(){
		alert("异常");
	}
 });
 */

	//尺码和color
	/*
		Support对象 
			添加元素框对象

		使用方法：
			获取对象 new Support(容器id名称)
			调用add()为容器添加元素框
			添加完毕后调用commit() 进行完毕
	*/
	function Support(cntEle){
		// 根据class名称查找元素 - 下标从0开始
		var elements = cntEle.$('.span-support');
		var all_ClickIndex;  //全局的当前点击的下标
		var elementsContent;
		//给所有框添加点击事件
		function support_Click(){
			for(var i = 0; i < elements.length; i++){
				//闭包
				(function (i){
					elements[i].onclick = function(){
						resetSupport();
						elements[i].style.border = "1px solid red";
						all_ClickIndex = i;
						elementsContent = elements[i].innerHTML; //获取元素中文本
						//alert(elements[i].innerText);
					}
				})(i);
			}
		}
		//给所有框添加鼠标滑进和移出事件
		function support_MoveAndOut(){
			
			for(var i = 0; i < elements.length; i++){
				(function (i){ //闭包
					elements[i].onmousemove = function(){
						elements[i].style.cursor = "pointer";
						elements[i].style.border = "1px solid red";
					}
					elements[i].onmouseout = function() {
						if(i != all_ClickIndex)
							elements[i].style.border = "1px solid #ddd";
					}
				})(i);
			}
			
		}
		//将所有边框恢复
		function resetSupport(){
			for(var i = 0; i < elements.length; i++){
				elements[i].style.border = "1px solid #ddd";
			}
			
		}	
		
		this.add = function(desc){
			cntEle.insert("<span class='span-support'>"+desc+"</span>");
		}
		this.commit = function(){
			support_Click(); ///添加点击
			support_MoveAndOut(); //添加move_And_out
			//this.dd();   //对于this方法的调用，一般方法不能调用，只有this类型的方法才能调用，例如此处可以调用
		}
		//获取选中的文本
		this.getContent = function(){
			return elementsContent;
		}
	}

	/*
	
	var support2 = new Support($(".colors")[0]);
	support2.add("粉红色");
	support2.add("蓝色");
	support2.add("黑色");
	support2.add("玫瑰白");
	support2.commit();
	*/
    //json 数据
	/*
	var text='{"goodslist":[{"商品编号":"d0000 ","连接":"jk","图片路径":"image/goods4.jpg","商品名称":"黑白条纹打底衫","价格":"388","图片描述":"打底衫"},{"商品编号":"d0001 ","连接":"jj","图片路径":"image/goods5.jpg","商品名称":"七分袖圆领系带针织衫","价格":"281","图片描述":"针织衫"},{"商品编号":"d0002 ","连接":"dd","图片路径":"image/goods6.jpg","商品名称":"荷叶边不规则半身裙","价格":"299","图片描述":"半身裙"},{"商品编号":"d0003 ","连接":"dd","图片路径":"image/goods7.jpg","商品名称":"圆领长袖镂空钩花针织","价格":"258","图片描述":"针织衫"},{"商品编号":"d0004 ","连接":"dd","图片路径":"image/goods8.jpg","商品名称":"镂空圆领九分袖","价格":"388","图片描述":"圆领"},{"商品编号":"d0005 ","连接":"dd","图片路径":"image/goods9.jpg","商品名称":"圆领无袖针织连衣裙","价格":"399","图片描述":"连衣裙"},{"商品编号":"d0006 ","连接":"dd","图片路径":"image/goods10.jpg","商品名称":"喇叭长袖圆领蕾丝连衣","价格":"288","图片描述":"蕾丝连衣"},{"商品编号":"d0007 ","连接":"dd","图片路径":"image/goods11.jpg","商品名称":"V领粗条纹针织连衣裙","价格":"378","图片描述":"连衣裙"},{"商品编号":"d0008 ","连接":"dd","图片路径":"image/goods12.jpg","商品名称":"条纹衬衫时尚连衣裙","价格":"355","图片描述":"连衣裙"},{"商品编号":"d0009 ","连接":"dd","图片路径":"image/goods13.jpg","商品名称":"蕾丝拼接碎花雪纺衫","价格":"388","图片描述":"雪纺衫"},{"商品编号":"d0010 ","连接":"dd","图片路径":"image/goods14.jpg","商品名称":"浅色修身牛仔裤","价格":"288","图片描述":"牛仔裤"},{"商品编号":"d0011 ","连接":"dd","图片路径":"image/goods15.jpg","商品名称":"性感露背吊带","价格":"300","图片描述":"倒带衫"},{"商品编号":"d0012 ","连接":"dd","图片路径":"image/goods16.jpg","商品名称":"开叉高腰阔腿裤","价格":"399","图片描述":"阔腿裤"},{"商品编号":"d0013 ","连接":"dd","图片路径":"image/goods17.jpg","商品名称":"不规则开叉小脚裤","价格":"388","图片描述":"小脚裤"},{"商品编号":"d0014 ","连接":"dd","图片路径":"image/goods18.jpg","商品名称":"V领喇叭袖雪纺连衣裙","价格":"388","图片描述":"连衣裙"},{"商品编号":"d0015 ","连接":"dd","图片路径":"image/goods19.jpg","商品名称":"A字阔腿裤休闲裤","价格":"366","图片描述":"阔腿休闲裤"}]}';
    var obj = JSON.parse(text);
	*/
    showp();
	changep();
	//商品主图，鼠标进入事件
    function showp(){
		$("#main_left_top").onmousemove=function(e){
			var m_top=$("#main_left_top").getBoundingClientRect().top;
			var m_left=$("#main_left_top").getBoundingClientRect().left;
			var max_w=$("#main_left_top").offsetWidth-62;
			var max_h=$("#main_left_top").offsetHeight-62;
			var m_x=e.pageX-m_left;
			var m_y=e.pageY-m_top;
			var id_id1=Num_ran5();
			if(m_x>62&&m_x<max_w&m_y>62&&m_y<max_h){
				$("#getshow").style.marginTop=(m_y-62)+"px";
				$("#getshow").style.marginLeft=(m_x-62)+"px";   
			}
			$("#getshow").style.display = "block";
			$("#show").css("display: block; margin-top: " + (m_top-2) + "px; margin-left: " + (m_left+310) + "px;", false);
			$("#showimg").src = imgPath;
		};
		$("#main_left_top").onmouseout=function(){
			$("#show").style.display="none";
			$("#getshow").style.display="none";
		}
	}
	//鼠标进入动态
	function changep(){
		$("#imgshow1").onmousemove=function(){
		    $("#imgshow").src = imgPath;
		}
		$("#imgshow2").onmousemove=function(){
			$("#imgshow").src = imgPath;
		}
		$("#imgshow3").onmousemove=function(){
			$("#imgshow").src = imgPath;
		}
		$("#imgshow4").onmousemove=function(){
			$("#imgshow").src = imgPath;
		}
	}
	adver();
	//动态图
	function adver(){
		var m_left1=0;
		var m_left2=25;
		var m_left3=50;
		var m_left4=75;
		var num=0;
		var flag=false;
		var flag1=false;
		var flag_stop=false;
		var flag_stop1=true;
		var time_r;
		var timer;
		var imgs = ["../image/goods/goods1.jpg", "../image/goods/goods2.jpg", "../image/goods/goods3.jpg", "../image/goods/goods4.jpg"];
		mudle_article1("article1", imgs[0]);
		mudle_article1("article2", imgs[1]);
		mudle_article1("article3", imgs[2]);
		mudle_article1("article4", imgs[3]);
		$("#article1").style.marginLeft=m_left1+"%";
		$("#article2").style.marginLeft=m_left2+"%";
		$("#article3").style.marginLeft=m_left3+"%";
		$("#article4").style.marginLeft=m_left4+"%";
		stop_();
		$("#Picture_adver").onmousemove=function(){
		    /*if(flag_stop1){
                if(flag_stop){
					flag_stop1=false;
					clearInterval(time_r);
					clearInterval(timer);
				}
			}*/
		}
        $("#Picture_adver").onmouseout=function(){
			/*flag_stop1=true;
		    stop_();*/
		}
        function stop_(){
			time_r=setInterval(function(){
				flag_stop=false;
				timer=setInterval(function(){
					m_left1--;
					m_left2--;
					m_left3--;
					m_left4--;
					num++;
					$("#article1").style.marginLeft=m_left1+"%";
					$("#article2").style.marginLeft=m_left2+"%";
					$("#article3").style.marginLeft=m_left3+"%";
					$("#article4").style.marginLeft=m_left4+"%";
					//当距离左边-50时删除并从后面插入并距离左边50
					if(m_left1==-50){
						$("#article_con").removeChild($("#article1"));
						mudle_article1("article1", imgs[0]);
						m_left1=50;
						$("#article1").style.marginLeft=m_left1+"%";
					}
					if(m_left2==-50){
						$("#article_con").removeChild($("#article2"));
						mudle_article1("article2", imgs[1]);
						m_left2=50;
						$("#article2").style.marginLeft=m_left2+"%";
					}
					if(m_left3==-50){
						$("#article_con").removeChild($("#article3"));
						mudle_article1("article3", imgs[2]);
						m_left3=50;
						$("#article3").style.marginLeft=m_left3+"%";
					}
					if(m_left4==-50){
						$("#article_con").removeChild($("#article4"));
						mudle_article1("article4", imgs[3]);
						m_left4=50;
						$("#article4").style.marginLeft=m_left4+"%";
					}
					if(num==25){
						//console.log("m_left1:"+m_left1);
						//console.log("m_left2:"+m_left2);
						//console.log("m_left3:"+m_left3);
						//console.log("m_left4:"+m_left4);
						num=0;
						flag_stop=true;
						clearInterval(timer);
						
					}
				},50);
			},4000);
		}
		//模板
		function mudle_article1(id_id,p_url){
			$("#article_con").insert("<article title='适合你的购物网站' id="+id_id+"><img src="+p_url+" alt='' width='100%' height='100%'></article>");
		}
		
		$(".add-Car-Bt")[0].onclick = function(){
			var obj = new JSONObject ()
			obj.put("id", id);
			if(!privili) {
				alert("请登录");
				return;
			}
			else if(support1 == undefined || support1.getConten() == undefined || support2.getConten() == undefined)
			{
				alert("请选择尺码, 和颜色");
				return;
			}
			obj.put("size", support1.getConten());
			obj.put("color", support2.getConten());
			ajax({
				type:"post",
				url:"member_addCar",
				data:{data:obj.toString(),},
				success:function(msg){
					if(isJSON(msg)){
						var object = Tokener.parseString(msg);
						//不存在 插入  （存在 对数字进行修改）
						if(!object.get("isExit")){
							$(".shop_list_cnt")[0].$("ul")[0].insert(createCar(object.get("id"), object.get("img"), object.get("name"), object.get("size"), 1, object.get("price")));
						}else {
							var lis = $(".shop_list_cnt")[0].$("li");
							for(var i = 0; i < lis.length; i ++){
								if(lis[i].attr("data-id") == object.get("id"))
									lis[i].$(".goods-num")[0].text(object.get("quantity"));
							}
						}
						alert("已加入购物车");
					}else alert("数据异常");
					
				},
				error:function(){
					alert("操作失败");
				}
			});
		}
		$(".add-Colle-Bt")[0].onclick = function(){
			if(!privili) {
				alert("请登录");
				return;
			}
			ajax({
				type:"post",
				url:"member_addColle",
				data:{data:id,},
				success:function(msg){
					if(isJSON(msg)){
						var object = Tokener.parseObject(msg);
						if(!object.get("isExit")){
							$(".colle-bt-li")[0].insert(colleMudle(coll.get("id"), coll.get("img"), coll.get("name"), coll.get("price"), coll.get("time")));
						}else alert("已添加收藏");
					}else alert("服务器数据异常");
					//colleMudle
				},
				error:function(){
					alert("操作失败");
				}
			});
		}
	}
	//初始化右栏
	var privili = true;
	//登录成功 添加容器  收藏 足迹
	$(".colle-bt-li")[0].insert(cntMudle("colle-cnt"));
	if(colls != null){
		for(var i = 0; i < colls.length(); i++){
			var coll = colls.getJSONObject(i);
			var item = getGoodsItemById(coll.get("id"));
			if(item != null){
				$(".colle-cnt")[0].insert(createFoot(item.get("id"), "../"+item.get("img"), item.get("name")));
			}else{
				console.log("err:"+coll.get("id"));
			}
			
		}
	}

	$(".foot-bt-li")[0].insert(cntMudle("foot-cnt"));
	if(foots != null){
		for(var i = 0; i < foots.length(); i++){
			var foot = foots.getJSONObject(i);
			var item = getGoodsItemById(foot.get("id"));
			if(item != null){
				$(".foot-cnt")[0].insert(createFoot(item.get("id"), "../"+item.get("img"), item.get("name")));
			}else{
				console.log("err:"+foot.get("id"));
			}
		}
	}
	
	if(cars != null){
		var rmb = 0;
		for(var i = 0; i < cars.length(); i++){
			var car = cars.getJSONObject(i);
			var item = getGoodsItemById(car.get("id"));
			if(item != null){
				$(".shop_list_cnt")[0].$("ul")[0].insert(createCar(item.get("id"), "../"+item.get("img"), item.get("name"), car.get("size"), car.get("count"), item.get("price")));
				rmb += car.get("count")*item.get("price");
			}else{
				console.log("err:"+car.get("id"));
			}
		}
		$(".RMB_NUM")[0].text(rmb);
	}

	$(".my-infor-li")[0].insert(createInfor_login("../image/person/tako.jpg", "xxxxx", 120));
	/*
	var privili = false;
	ajax({
		type:"post",
		url:"initIndex",
		success:function(msg){
			console.log(msg);
			if(isJSON(msg)){
				var es = $(".bar-nologin");
				for(var i = 0; i < es.length; i ++){
					se[i].remove();
				}
				privili = true;
				//登录成功 添加容器  收藏 足迹
				$(".colle-bt-li")[0].insert(createCnt("colle-cnt"));
				$(".foot-bt-li")[0].insert(createCnt("foot-cnt"));

				var object = Tokener.parseObject(msg);
				//购物车
				var cars = object.get("car");
				var carit = objArr.itarator();
				var money = 0;
				while(carit.hasNext()){
					var car = carit.next();
					$(".shop_list_cnt")[0].$("ul")[0].insert(createCar(car.get("id"), car.get("img"), car.get("name"), car.get("size"), car.get("quantity"), car.get("price")));
					money += car.get("quantity");
				}
				$(".RMB_NUM")[0].text(money);
				//收藏
				var colles = object.get("colle");
				if(colles.length > 0){
					var collit = objArr.itarator();
					while(collit.hasNext()){
						var coll = collit.next();
						$(".colle-cnt")[0].insert(colleMudle(coll.get("id"), coll.get("img"), coll.get("name"), coll.get("price"), coll.get("time")));
					}
				}

				//足迹
				var foots = object.get("foot");
				if(foots.length > 0){
					var footit = objArr.itarator();
					while(footit.hasNext()){
						var foot = footit.next();
						$(".foot-cnt")[0].insert(createFoot(foot.get("id"), foot.get("img"), foot.get("name")));
					}
				}
				//个人 bar-login
				var person = object.get("infor");
				$(".my-infor-li")[0].insert(createInfor_login(person.get("name"), person.get("integral")));
				//
				$(".loginText")[0].text(person.get("Name")+"，欢迎您。");
			}else if(msg == "false"){
				//无权限
				console.log("当前为登录权限：" + msg);
				$(".foot-bt-li")[0].insert(createInfor_no());
				$(".colle-bt-li")[0].insert(createInfor_no());
				$(".my-infor-li")[0].insert(createInfor_no());
				$(".car-bt-li")[0].insert(createInfor_no());
			}else alert("数据异常");
		},error:function(){
			alert("初始化异常");
		}
	});
	*/
	$(".my-cart")[0].onclick = function(){
		if(privili) window.open('用户个人页.html');
		else alert("未登录");
	}
	
	$(".my-infor")[0].onclick = function(){
		if(privili) window.open('用户个人页.html');
		else alert("未登录");
	}
	$(".my-order")[0].onclick = function(){
		if(privili) window.open('用户个人页.html');
		else alert("未登录");
	}
	$(".register-bt")[0].onclick = function(){
		window.open('memberRegister.html');
	}
	$(".loginText")[0].onclick = function(){
		window.open('memberLogin.html');
	}
	
 </script>
</html>